<template>
  <div class="shop-classify-page">
    <img src="../assets/icon_cj.png"/>
    <div class="text">
        <p>
            <b>{{zhText.substring(0,2)}}</b>
            <span>{{zhText.substring(2)}}</span>
        </p>
        <p>{{enText}}</p>
    </div>
    <img v-if="isMore" src="../assets/mores.png" alt="">
  </div>
</template>

<script>

export default {
    props:{
        isMore:{
            default:true
        },
        zhText:"",
        enText:""
    },
  name: '',

  components: {},

  data() {
    return {}
  },

  created() {},

  methods: {},

}

</script>

<style scoped lang='less'>
.shop-classify-page{
    width: 100vw;
    height: 122px;
    display: flex;
    align-items: center;
    padding: 0 32px;
    background: #fff;
    box-sizing: border-box;
    //&代表父级 即 .shop-classify-page
    & img:first-child{
        height: 32px;
        margin-right: 32px;
    }
    .text p{
        margin: 0;
    }
    .text{
        flex:1;
    }
    .text p:first-child{
        font-size: 18px;
    }
    .text p:last-child{
        font-size: 10px;
        color: #999;
    }
    & img:last-child{
        height: 10px;
    }
}
</style>